<template>
  <el-dialog
    :title="$t('caseorder.anli40')"
    :visible.sync="dialogShow"
    width="700px"
    height="300px"
    :close-on-click-modal="false"
  >
    <div class="orderSend_inner">
      <el-form
        ref="form"
        :size="optionButtonSize"
        label-position="top"
        label-width="100px"
        :model="form"
        :rules="formRules"
      >
        <el-form-item :label="$t('caseorder.anli41') + '：'" prop="logisticsCompany">
          <el-input
            v-model="form.logisticsCompany"
            style="width: 370px"
            clearable
            :placeholder="$t('add.add43')"
          />
          <!-- <el-select style="width:370px" clearable v-model="form.logisticsCompany" :placeholder="$t('caseorder.anli42')">
            <el-option v-for="(item, index) in dataList" :key="index" :label="item.name" :value="item.name">
            </el-option>
          </el-select> -->
        </el-form-item>
        <el-form-item :label="$t('caseorder.anli43') + '：'" prop="logisticsNo">
          <el-input
            v-model="form.logisticsNo"
            style="width: 370px"
            clearable
            :placeholder="$t('caseorder.anli44')"
          />
        </el-form-item>
      </el-form>
    </div>

    <div slot="footer" class="dialog-footer">
      <el-button @click="cancelHandle() ">{{ $t('caseorder.anli45') }}</el-button>
      <el-button type="primary" @click="submitHandle()">{{ $t('caseorder.anli54') }}</el-button>
    </div>
  </el-dialog>
</template>

<script>
export default {
  name: 'BLZMasterUploadDesign',

  data() {
    return {
      form: {
        id: '',
        logisticsCompany: '', // 物流商
        logisticsNo: '', // 物流单号
      },
      formRules: {
        logisticsCompany: [
          {
            required: true,
            message: this.$t('add.add058'),
            trigger: 'blur',
          },
        ],
        logisticsNo: [
          {
            required: true,
            message: this.$t('add.add058'),
            trigger: 'blur',
          },
        ],
      },
      dialogShow: false,
      dataList: [],
    };
  },

  created() {
    // this.getList()
  },

  methods: {
    getList() {
      this.$http
        .get('/express/list')
        .then(({ data: res }) => {
          if (res.code !== 0) {
            return this.$message.error(res.msg);
          } else {
            this.dataList = res.data;
          }
        })
        .catch((err) => {
          console.log('err', err);
        });
    },
    submitHandle() {
      this.$refs.form.validate((valid) => {
        if (valid) {
          this.$http
            .post('/order/orderUploadLogistics', this.form)
            .then(({ data: res }) => {
              if (res.code !== 0) {
                return this.$message.error(res.msg);
              } else {
                this.$message.success(this.$t('caseorder.anli62'));
                this.$emit('getSelectPageList',0);
                this.dialogShow = false;
                this.form = {
                  id: '',
                  logisticsCompany: '', // 物流商
                  logisticsNo: '', // 物流单号
                };
              }
            })
            .catch((err) => {
              console.log('err', err);
            });
        }
      });
    },
    cancelHandle(){
      this.dialogShow = false;
    
    }
  },
};
</script>

<style lang="scss">
// .orderSend_inner{

// }
</style>
